<template>
	<view class="page" style="height: 100vh;">
		<free-nav-bar :fixed="false" bgColor="bg-white" :keyword="keyword" @backhs="backfh" @confirm="confirminput" :backevent="backevent" :placeholder="placehodler" :showback="true" :showright="false"></free-nav-bar>
		
		<view v-if="searchtype == ''" class="">
			<view class="py-3 flex align-center justify-center">
				<text class="font text-light-muted">搜索指定内容</text>
			
			</view>
			<view class="px-4 flex flex-wrap">
				<view class="flex align-center justify-center mb-3 border-left border-right" @click="clicktype(item.key)"
					v-for="item in list" style="width: 223rpx;">
					<text class="font text-hover-primary">{{item.name}}</text>
				</view>
			
			</view>
		</view>
		
		<free-list-item v-for="item in userlist" :cover="item.avatar == ''? 'https://profile-avatar.csdnimg.cn/3365568353cd44c2acf217ab8b6345f9_weixin_47365777.jpg!1':user.avatar"
			 :title="item.nickname?item.nickname:item.username" @click="watchdetail(item.id)">
		
		</free-list-item>
	</view>
</template>

<script>
	import freeNavBar from "@/components/free-ui/free-nav-bar.vue"
	import freeListItem from "@/components/free-ui/free-list-item.vue"
import $H from '../../utils/request.js';
	export default {
		components: {
			freeNavBar,
			freeListItem
		},
		data() {
			return {
				userlist:[],
				backevent:true,
				list: [{
					name: "聊天记录",
					key: "history"
				}, {
					name: "用户",
					key: "user"
				}, {
					name: "群聊",
					key: "qunliao"
				}],
				searchtype: "",
				keyword:""
				
			}
		},
		computed:{
			placehodler(){
			let obj=this.list.find((item)=>{
				return item.key==this.searchtype
			})
			if(obj){
				console.log(obj,"objk");
				return obj.name+"搜索"
			}
			return '请搜索关键字'
			}

			
		},
		methods: {
			watchdetail(id){
				uni.navigateTo({
					url:"/pages/mail/userBase/userBase?id="+id
				})
			},
			confirminput(e){
				if(this.searchtype == ''){
					uni.showToast({
						title:"请选择搜索类型",
						icon:"none"
					})
				}
				console.log(e,"eeee")
	this.keyword=e.detail.value
				if(this.searchtype == 'user'){
					let data={
						keyword:e.detail.value
					}
					$H.post("search/user",data,{token:true}).then(res=>{
						this.userlist=[]
						if(res!==null&&res.status!==2){
						
						this.userlist.push(res)							
						}
						console.log(res,"res")

					})
				}
			},
			backfh(){
				console.log("bacl");
				if(this.searchtype !== ''){
					this.keyword=""
					this.searchtype="";
					this.userlist=[]
				}else{
					uni.navigateBack({
						delta: 1
					})				
				}
			},
			clicktype(e) {
				this.searchtype = e
			}
		}
	}
</script>

<style>

</style>
